﻿
@{
    ViewBag.Title = "Student";
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>课程管理--厚溥学生学籍管理系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="~/Content/font_eolqem241z66flxr.css" media="all" />
    <link rel="stylesheet" href="~/Content/user.css" media="all" />
</head>
<body class="childrenBody">
    <form class="layui-form">
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>学生列表</legend>
        </fieldset>
        <blockquote class="layui-elem-quote news_search">
            <div class="layui-inline">
                <div class="layui-input-inline">
                    <div class="layui-form-mid layui-word-aux">学生姓名</div>
                </div>
                <div class="layui-input-inline">
                    <input type="text" value="" id="courseName" placeholder="请输入学生姓名" class="layui-input search_input">
                </div>
                <div class="layui-input-inline">
                    <div class="layui-form-mid layui-word-aux">课程类型</div>
                </div>
                <div class="layui-inline selectMsg">
                    <select name="msgColl" lay-filter="selectMsg" id="courseType">
                        <option value="0">请选择课程类型</option>
                        <option value="1">java</option>
                        <option value="2">企信</option>
                        <option value="3">.net</option>
                        <option value="4">ph</option>
                    </select>
                </div>
                <a class="layui-btn search_btn">查询</a>
            </div>

            <div class="layui-inline">
                <a class="layui-btn layui-btn-normal usersAdd_btn">添加新生</a>
            </div>
        </blockquote>
        <div class="layui-form news_list">
            <table id="tb_List" lay-filter="majortool"></table>
            <script type="text/html" id="barDemo">
                <a class="layui-btn layui-btn-sm" lay-event="edit">编辑</a>
                <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="del">删除</a>
            </script>
        </div>
    </form>
    <div id="page"></div>
    <script src="/layui/layui.js"></script>
    <script type="text/html" id="StuSex">
        {{# if(d.Sex==true){ }}
        <span>女</span>
        {{# } else { }}
        <span>男</span>
        {{# } }}
    </script>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>
    <script>
        var $;
        layui.use(['form', 'table', 'jquery'], function () {  //如果只加载一个模块，可以不填数组。如：layui.use('form')
            var form = layui.form; //获取form模块
            //获取upload模块
            table = layui.table;
            $ = layui.jquery
            table.render({
                elem: '#tb_List'  //id
                , url: '/Stu/Student'  //数据接口
                , page: true  //开启分页
                , id: 'listTable'
                , method: 'post'
                , cols: [[
                    { field: 'Id', title: '编号', width: 80, sort: true },
                    { field: 'ClassName', title: '班级', width: 80, },
                    { field: 'StuName', title: '学生姓名', width: 100, },
                    { field: 'Age', title: '年龄', width: 80, },
                    { field: 'Sex', title: '性别', templet: "#StuSex", width: 80, },
                    { fixed: 'right', title: '操作', toolbar: '#barDemo', width: 150 }
                ]]
                , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
                    return {
                        "code": res.status, //解析接口状态
                        "msg": res.message, //解析提示文本
                        "count": res.total, //解析数据长度
                        "data": res.rows.item //解析数据列表
                    };
                }
            })

            //点击事件
            $(".search_btn").click(function () {
                table.reload('listTable', {
                    where: {  //建立连接数据参数
                        CourseName: $("#courseName").val()
                        , CourseType: $("#courseType").val()
                    }
                    , page: {
                        curr: 1  //从第一页开始查询
                    }
                });//只加载数据
            });

            //添加弹出框
            $(".usersAdd_btn").click(function () {
                layer.open({
                    type: 2,
                    title: '添加新生',
                    shadeClose: false,
                    shade: 0.5,
                    maxmin: true, //开启最大化最小化按钮
                    area: ['893px', '600px'],
                    content: '/Stu/StudentAdd'
                });
            })

            //监听行工具事件
            table.on('tool(majortool)', function (obj) {
                var data = obj.data;
                //console.log(obj)
                if (obj.event === 'del') {
                    layer.confirm('真的删除行么', function (index) {
                        $.post("@Url.Action("StudentDel","Stu")", { DelId: data.Id }, function (data) {
                            if (data.State == 1) {
                                obj.del();
                                layer.close(index);
                            }
                            else {
                                layer.msg(data.Message)
                            }
                        }, "json")

                    });
                } else if (obj.event === 'edit') {
                    layer.open({
                    type: 2,
                    title: '编辑信息',
                    shadeClose: false,
                    shade: 0.5,
                    maxmin: true, //开启最大化最小化按钮
                    area: ['893px', '600px'],
                    content: '/Stu/StudentEdit?id=' + data.Id
                });
                }
            });

        });
    </script>
</body>
</html>

